<template>
	<view class="content-wrap">
		<!-- #ifdef MP-WEIXIN -->
			<view class="" v-if="!userInfo" style="position: absolute; padding: 30upx 10upx; width: 500upx; height: 380upx; top: 30%; text-align: center; border-radius: 30upx; margin-left: 140upx; z-index: 9999; background-color: #ffffff;">
				<image style="width: 140upx; height: 140upx;"
				 :src="imglink + 'person.svg'" mode=""></image>
				<view class="" style="font-size: 40upx; font-weight: bold; color: rgba(0,0,0,0.85); margin-top: 20upx;">
					您还未登录
				</view>
				<view style="font-size: 28upx;color: rgba(0,0,0,0.45);">
					需要登录后才能查看
				</view>
				<button style="width: 370upx; z-index: 9999; margin-top: 30upx; font-size: 28upx; background: #02C15F;border-radius: 8px;"
				  type="primary" open-type="getUserInfo" 
				  @click="getuserinfo">授权登录</button>
			</view>
		<!-- #endif -->
		<!-- 左上浮动按钮 start -->
		<view class="top-float">
			<view class="go-home" @click="backHome">
				<image :src="imglink + 'home/home-Selected.png'" mode=""></image>
			</view>
			<view class="music" :class="{'music-active':isMusicOn}" v-if="itemAct.music == 1" @click="changMusicStatus">
				<image :src="imglink + 'home/music.png'" mode=""></image>
			</view>
			<view class="contact-teacher" @click="opConcatPop()">
				<image :src="imglink + 'home/contact.png'"></image>
			</view>
			<view class="share" @click="sharePoster">
				<image :src="imglink + 'home/share.png'" mode=""></image>
			</view>
			<!-- <view v-if="share == 0" class="clues" @click="jumpClues">
				活动线索
			</view> -->
		</view>
		<!-- 左上浮动按钮 end -->

		<!-- 课程封面 start -->
		<view class="top">
			<!-- <view class="img-wrap"><image class="top-img" :src="imglink + '/member/active_image_share.png'" mode="widthFix"></image></view> -->
			<view class="img-wrap">
				<swiper class="swiper" :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration">
					<swiper-item style="text-align: center;" v-for="item in itemAct.image" :key='item.activity_image_id'>
						<image class="top-img" :src="item.image ||item" mode="aspectFill"></image>
					</swiper-item>
				</swiper>
			</view>
			<view class="active-time-wrap">
				<view class="left">
					<view class="small-font">限时特惠</view>
					<view class="normal-font">¥{{itemAct.course_msg[0].group_purchase_price}}</view>
					<view class="small-font">
						原价 ¥
						<span style="text-decoration:line-through;">{{itemAct.course_msg[0].origin_price}}</span>
					</view>
				</view>
				<view class="center">
					<view class="small-font">剩余名额</view>
					<view class="normal-font">{{(itemAct.allowed_total - itemAct.buyer - itemAct.virtual_total) >0 ? itemAct.allowed_total - itemAct.buyer - itemAct.virtual_total: 0}}</view>
				</view>
				<view class="right" v-if="startEnd != 0">
					<view class="small-font">距离活动结束</view>
					<view class="countdown">
						<view>{{ d }}</view>
						天
						<view>{{ h }}</view>
						:
						<view>{{ min }}</view>
						:
						<view>{{ sec }}</view>
					</view>
				</view>
				<view class="right" v-else>
					<view class="small-font">活动已结束</view>
				</view>
			</view>
			<view class="active-title">{{itemAct.name }}</view>
		</view>
		<!-- 课程封面 end -->
		<!-- 详情 start -->
		<view class="main">
			<!-- 正在参与 start -->
			<view class="join-peopel-wrap">
				<view class="join-avatar-wrap">
					<view class="join-avatar-item" v-for="(item,index) in avatarShowList" :key="index">
						<image :src="item.avatar" mode="aspectFill"></image>
					</view>
					<!-- <view class="join-avatar-item">
						<image :src="imglink + 'head-portrait.png'" mode="aspectFill"></image>
					</view>
					<view class="join-avatar-item">
						<image :src="imglink + 'head-portrait.png'" mode="aspectFill"></image>
					</view>
					<view class="join-avatar-item">
						<image :src="imglink + 'head-portrait.png'" mode="aspectFill"></image>
					</view>
					<view class="join-avatar-item">
						<image :src="imglink + 'head-portrait.png'" mode="aspectFill"></image>
					</view> -->
				</view>
				<view class="join-peopel-right">
					<span class="num">{{(itemAct.virtual_total + itemAct.buyer) || 0}}</span>
					人正在参与
				</view>
			</view>
			<!-- 正在参与 end -->

			<!-- 参团 start -->
			<!-- <view class="group-wrap">
				<view class="my-group my-group-border">
					<view class="my-group-header">
						<view class="my-group-header-left"></view>
						<view class="medium-font">我参与的团</view>
						<view class="my-group-header-right"></view>
					</view>
					<view class="my-group-list">
						<view class="my-group-item" v-for="(item,index) in groupInfo.myGroupList" :key="item.assemble_id">
							<view class="left">
								<image :src="item.leader.avatar" mode="aspectFill"></image>
								<span class="medium-font">{{item.leader.nickname | nickname_value}}</span>
							</view>
							<view class="center">
								<view class="top-tip">
									<span>已有{{item.purchased}}人</span>
									<span class="text">还差{{item.quanlity_group_purchase - item.purchased}}人</span>
								</view>
								<progress :percent="(item.purchased/item.quanlity_group_purchase)*100" activeColor="#FF8B46" border-radius="3" stroke-width="5" />
							</view>
							<view class="right"><view class="invite-btn" @click="invitJoinGruop(item)">邀请参团</view></view>
						</view>
					</view>
				</view>

				<view class="my-group ">
					<view class="my-group-header">
						<view class="my-group-header-left"></view>
						<view class="medium-font">正在拼团</view>
						<view class="my-group-header-right"></view>
					</view>
					<view class="my-group-list">
						<view class="my-group-item" v-for="(item,index) in groupInfo.otherGropList" :key="item.assemble_id">
							<view class="left">
								<image :src="item.leader.avatar" mode="aspectFill"></image>
								<span class="medium-font">{{item.leader.nickname | nickname_value}}</span>
							</view>
							<view class="center">
								<view class="top-tip">
									<span>已有{{item.purchased}}人</span>
									<span class="text">还差{{item.quanlity_group_purchase - item.purchased}}人</span>
								</view>
								<progress :percent="(item.purchased/item.quanlity_group_purchase)*100" activeColor="#FF8B46" border-radius="3" stroke-width="5" />
							</view>
							<view class="right"><view class="invite-btn" @click="joinOneGroup(item)">去参团</view></view>
						</view>
						<view>
						</view>
						<view class="view-more small-font" @click="toActiveGroup">查看更多>></view>

					</view>
				</view>
			</view> -->
			<!-- 参团 end -->

			<!-- 活动课程 start -->
			<view class="active-course-wrap" v-if="itemAct.course_msg.length >1">
				<view class="active-course-top">
					<image class="top-bg" :src="imglink + 'home/home_image_background.png'"></image>
					<view class="top-title">活动课程</view>
				</view>
				<view class="active-course-list">
					<view class="active-course-item" v-for="(item,index) in itemAct.course_msg" :key='item.activity_course_id'>
						<view class="course-index-wrap">
							<image :src="imglink + 'home/home_image_back.png'" mode=""></image>
							<!-- //#ifdef H5-->
							<view class="course-index">课程{{index+1}}</view>
							<!-- //#endif-->
							<!-- //#ifdef MP-WEIXIN-->
							<!-- <view class="course-index">课程{{index}}</view> -->
							<!-- //#endif-->
						</view>
						<view class="course-title">
							{{item.name | goodName_val}}
						</view>
						<view class="course-price-wrap">
							<view class="original-price">原价 : <span style="text-decoration:line-through;color: #999999;">¥{{item.origin_price}}</span></view>
							<view class="active-price">活动价 : <span class="text"> ¥{{item.group_purchase_price}}</span> </view>
						</view>
						<view class="buy-num-wrap">
							<view class="sub-buy-btn" @click="reduceNum(item)">
								<image :src="imglink + 'home/sub-btn.svg'" mode=""></image> 减少购买数量
							</view>
							<view class="buy-num">{{item.courseNum}}</view>
							<view class="add-buy-btn" @click="addNum(item)">
								<image :src="imglink + 'home/add-btn.png'"></image>添加购买数量
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 活动课程 end -->

			<!-- 联系老师 start -->
			<view class="contact-teacher-wrap">
				<view class="contact-teacher-top">
					<image class="top-bg" :src="imglink + 'home/home_image_background.png'"></image>
					<view class="top-title">联系老师</view>
				</view>
				<view class="contact-teacher-tip">(长按添加老师微信咨询)</view>
				<view class="contact-teacher-main">
					<view class="teacher-code-warp">
						<image class="teacher-code" :src="teacherWay.wechat_qrcode" mode="widthFix"></image>
					</view>
				</view>
				<view class="teacher-phone">老师电话：{{teacherWay.telephone}}</view>
				<view class="call-phone-btn" @click="callPhone">拨打</view>
			</view>
			<!-- 联系老师 end -->
			<!-- 活动介绍 start -->
			<view class="active-detail-wrap">
				<view class="active-detail-top">
					<image class="top-bg" :src="imglink + 'home/home_image_background.png'"></image>
					<view class="top-title">活动介绍</view>
				</view>
				<view class="active-detail-list">
					<view class="active-detail-item" v-for="(item,index) in itemAct.course_msg" :key='item.activity_course_id'>
						<!-- <span class="course-index">课程{{index+1}}：</span>
						{{item.name | goodName_val}} -->
						<!-- :key='i+1' -->
						<view :style="{heigth:info.image!=null || info.type == 'photo'?'height: 344upx;':''}" class="course-content-img"
						 v-for="(info,i) in item.activity_course_description" :key='i' v-if="item.activity_course_description.length!=0">
							<image :src="info.image || info.value" mode="widthFix" v-if="info.image!=null || info.type == 'photo'"></image>
							<view class="course-content-tip" v-else>
								<!-- 占地3000平方米，15个名师，3个机构 -->{{info.text || info.value}}
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 活动介绍 end -->

			<!-- 门店活动地址 start -->
			<view class="store-address-wrap" v-if="storeList.length!=0">
				<view class="store-address-top">
					<image class="top-bg" :src="imglink + 'home/home_image_background.png'"></image>
					<view class="top-title">门店活动地址</view>
				</view>
				<view class="top-tip">参与活动的门店地址</view>
				<view class="store-address-list">
					<view class="store-address-item" v-for="(item,index) in storeList" :key='index'>
						<view class="store-address-left">
							<view class="store-name">{{item.name | addr_value}}</view>
						</view>
						<view class="store-address-center">
							<view class="store-address">{{item.addressContent | address_value}}</view>
						</view>
						<view class="store-address-right">
							<image :src="imglink + 'home/location-icon.png'" mode=""></image>
						</view>
					</view>
				</view>
			</view>
			<!-- 门店活动地址 end-->
		</view>
		<!-- 详情 end -->

		<!-- 底部栏 start -->
		<view class="floor">
			<view class="floor-float">
				<!-- <view class="my-join-group float-item" v-if="groupInfo.myGroupList.length > 0" @click="toActiveGroup">
					我参加团
					<span>还差{{groupInfo.myGroupList[0].quanlity_group_purchase - groupInfo.myGroupList[0].purchased}}人</span>
				</view> -->
				<view class="swiper-wrap float-item" v-if="swiperPurchaseList.length > 0">
					<swiper class="swiper" :indicator-dots="false" :autoplay="true" :interval="1500" :duration="500" :circular="true"
					 :vertical="true" :disable-touch="true">
						<swiper-item class="swiper-item" v-for="(item,index) in swiperPurchaseList" :key="index">
							<image :src="item.avatar" mode=""></image>
							<view v-if="item.nickname">{{item.nickname | nickname_value}}</view>
							<view>已购买</view>
						</swiper-item>
					</swiper>
				</view>
			</view>
			<view class="floor-left" @click="carPopup" v-if="itemAct.course_msg.length >1">
				<image :src="imglink + 'member/shopping@2x.svg'" mode=""></image>
				<view class="red-point">{{ courseAmount }}</view>
			</view>
			<view class="floor-right">
				<!-- <view class="to-creat-btn" @click="joinGroup" >去开团</view> -->
				<view class="to-join-btn" @click="joinOhter">去参团</view>
			</view>
		</view>
		<!-- 底部栏 end -->

		<!-- 联系老师弹窗 start -->
		<uni-popup ref="contactTeacherPopup">
			<view class="contact-teacher-pop-wrap">
				<view class="teacher-pop-tip">长按保存老师二维码 扫一扫添加老师微信</view>
				<view class="contact-teacher-main">
					<view class="teacher-code-warp">
						<image class="teacher-code" :src="teacherWay.wechat_qrcode" mode="widthFix" bindlongpress="savepicture" :show-menu-by-longpress="true"></image>
					</view>
				</view>
				<view class="teacher-info">
					<view>老师微信号 : {{teacherWay.wechat_number}}</view>

					<view class="copy-btn" @click="copyData(teacherWay.wechat_number)">复制</view>
				</view>
				<view class="teacher-info">
					<view>老师电话 : {{teacherWay.telephone}}</view>

					<view class="copy-btn" @click="callPhone">拨打</view>
				</view>
			</view>
		</uni-popup>
		<!-- 联系老师弹窗 end -->
		<!-- 科目购物车弹框  start-->
		<uni-popup ref="shoppingPopup" :custom="true" type="bottom">
			<view class="popup_shopping">
				<view class="popup_shopping-content">
					<view class="course_type-title" style="height: 200upx;">
						<view class="act-state-detail">
							已报名课程
						</view>
						<!-- 						<view class="act-state-tip" v-if="itemAct.enable_allowed_purchase_quantity== '1'">
							本活动每个人限报{{itemAct.allowed_purchase_quantity}}个课程
						</view> -->
					</view>
					<view v-if="courseAmount != 0">
						<scroll-view scroll-y="true" scroll-with-animation :style="'height:'+height+'px'">
							<!-- <view class="popup_shopping-details" v-if="item.courseNum != 0" v-for="(item,index) in itemAct.course_msg" :key='index'>
								<view class="popup_shopping-title">
									{{item.name |goodName_val}}
								</view>
								<view class="course-details-content">
									<view class="course-content-left">
										<image class="course-content_img" :src="item.image || item.imageMainCourse" mode=""></image>
										<view class="">
											<view class="course-content-sold" :style="{marginBottom:isGroup=='group'?'16upx':''}">市场价:<text>￥{{item.origin_price}}</text></view>
											<view class="course-content-sale" >优惠价:<text :style="{fontSize:isGroup=='group'?'32upx':''}">￥{{item.special_price}}</text></view>
											<view class="group-sale" v-if="isGroup=='group'"><text>{{itemAct.group_purchase[0].quanlity_group_purchase}}</text>人成团价:<text>￥{{item.group_purchase_price}}</text></view>
										</view>
									</view>
									<view class="course-content-right">
										<view class="">
											购买数量
										</view>
										<view class="">
											<image :src="imglink + 'home/reduce_black.png'" mode="" @click="reduceNum(item)"></image>
											<text>{{item.courseNum}}</text>
											<image :src="imglink + 'home/add-colours.png'" mode=""  @click="addNum(item)"></image>
										</view>
									</view>
								</view>
							</view> -->
							<view class="active-course-list">
								<view class="active-course-item" v-if="item.courseNum != 0" v-for="(item,index) in itemAct.course_msg" :key='index'>
									<view class="course-index-wrap">
										<image :src="imglink + 'home/home_image_back.png'" mode=""></image>
										<view class="course-index">课程{{index+1}}</view>
									</view>
									<view class="course-title">
										{{item.name | goodName_val}}
									</view>
									<view class="course-price-wrap">
										<view class="original-price">原价 : <span style="text-decoration:line-through;color: #999999;">¥{{item.origin_price}}</span></view>
										<view class="active-price">活动价 : <span class="text"> ¥{{item.group_purchase_price}}</span> </view>
									</view>
									<view class="buy-num-wrap">
										<view class="sub-buy-btn" @click="reduceNum(item)">
											<image :src="imglink + 'home/sub-btn.svg'" mode=""></image> 减少购买数量
										</view>
										<view class="buy-num">{{item.courseNum}}</view>
										<view class="add-buy-btn" @click="addNum(item)">
											<image :src="imglink + 'home/add-btn.png'"></image>添加购买数量
										</view>
									</view>
								</view>
							</view>
						</scroll-view>
					</view>
				</view>
				<view class="floor">
					<view class="floor-left" @click="carPopupClose()">
						<image :src="imglink + 'member/shopping@2x.svg'" mode=""></image>
						<view class="red-point">{{ courseAmount }}</view>
					</view>
					<view class="floor-right">
						<!-- <view class="to-creat-btn" @click="joinGroup" >去开团</view> -->
						<view class="to-join-btn" @click="joinOhter">去参团</view>
					</view>
				</view>

			</view>
		</uni-popup>
		<!-- 科目购物车弹框  end-->
		<!-- 分享提示 start-->
		<uni-popup ref="shareTip" :custom="true">
			<view class="popup_box_de_share">
				<image class="popup_box_close_share" :src="imglink + 'share_tip.png'"></image>
			</view>
		</uni-popup>
		<!-- 分享提示 end -->



	</view>
</template>

<script>
	import uniPopup from '@/components/uni-popup/uni-popup.vue';
	import {
		formatFullTime
	} from '@/common/util.js';
	//#ifdef H5
		import h5Copy from '@/js_sdk/junyi-h5-copy/junyi-h5-copy/junyi-h5-copy.js'
		import wx from '@/common/wx-js-sdk.js';
		// import {
		// 	Howl,
		// 	Howler
		// } from 'howler';
	//#endif
	export default {
		components: {
			uniPopup
		},
		filters: {
			
			nickname_value(value) {
				if (value.length == 1) {
					value = '*'
				} else if (value.length == 2) {

					value = value.substring(0, 1) + "*"
				} else {
					value = value.substring(0, 1) + "*" + value.substring(value.length - 1, value.length)
				}
				return value
			},
			goodName_val(value) {
				if (!value) return ''
				if (value.length > 40) {
					return value.slice(0, 40) + '...'
				}
				return value
			},
			goodName(value) {
				if (!value) return ''
				if (value.length > 38) {
					return value.slice(0, 38) + '...'
				}
				return value
			},
			addr_value(value) {
				if (!value) return ''
				if (value.length > 4) {
					return value.slice(0, 4) + '...'
				}
				return value
			},
			address_value(value) {
				if (!value) return ''
				if (value.length > 28) {
					return value.slice(0, 28) + '...'
				}
				return value
			},
			ellipsis(value, length) {
				if (!value) return ''
				if (value.length > length) {
					return value.slice(0, length) + '...'
				}
				return value
			}
		},
		data() {
			return {
				msg: '', // 弹幕用户名
				id: '', // 弹幕id
				avatar: '', //弹幕用户头像
				barrageList: {},
				msg1: '参与了活动',
				mWidth: 0,
				indicatorDots: true,
				autoplay: false,
				interval: 2000,
				duration: 500,
				isCourseShow: false,
				courseAmount: 0,
				options: '',
				itemAct: '',
				startEnd: null, // 时间差
				countDown: '', // 离结束时间倒计时
				currentTime: '', // 当前时间
				d: '', // 倒计时天数
				h: '', // 倒计时小时
				min: '', // 倒计时分钟
				sec: '', // 倒计时秒,
				t1: null, // 倒计时
				coupocMsg: '',
				actTime: true,
				teacherWay: {},
				storeList: [],
				isGroup: '',
				enable_head_welfare: '',
				head_welfare_content: '',
				quanlity_group_purchase: '',
				totalOriginPrice: 0,
				totalWholesalePayPrice: 0,
				height: 300,
				currentPge: '',
				showActDetail: true,
				store_id: "",
				isShowOtherGroup: false,
				is_group: '',
				token: "",
				buy_method: '',
				order_id: 0,
				shared_customer_id: 0,
				customerInfo: '', //我的信息
				groupInfo: {
					myGroupList: [], //我参与的团
					otherGropList: [], //正在拼团,
					endGroupList: [] //已完成的团
				},
				avatarShowList: [],
				music_url: '', // 音乐链接
				isMusicOn: true, // 音乐开关
				musicAudio: '',
				swiperPurchaseList: [] ,// 已购买轮播人员列表
				userInfo:'',
				imglink: this.$store.state.imgLink
			};
		},
		onLoad(option) {
			// #ifdef H5
				let pages = getCurrentPages()
				this.currentPge = pages[0].$route.fullPath
			// #endif
			let share = 1
			this.$store.commit('updataShare', share)
			// option = {
			// 	page:"details",
			// 	actId:"168",
			// 	store_id:"101"
			// }
			// this.fullTime('2020-10-30 14:07:00');
			this.options = option
			console.log(this.options, 'OOOOOOOO')
			let store_id = parseInt(option.store_id, 10);
			if (!store_id > 0) {
				store_id = uni.getStorageSync('store_id')
			} else {
				uni.setStorageSync('store_id', store_id)
			}
			this.store_id = store_id
			this.$store.commit('updateStoreId', store_id)
			let token = option.token;
			if (!token) {
				token = uni.getStorageSync('token')
			} else {
				uni.setStorageSync('token', token);
			}
			if (!token) {
				let url = this.$store.state.URL + "/customer/user/wx_login?page=" + encodeURIComponent(this.currentPge)
				console.log(url, '111111111111111111111111');
				console.log(this.currentPge, '222222222222222222222222');
				location.href = url
				console.log(url);
				uni.showToast({
					icon: 'none',
					title: url
				})
				return
			}
			this.token = token
			this.$store.commit('updateToken', token)
			console.log(option)
			// 获取音乐
			this.getMusic()
			this.userInfo = uni.getStorageSync("userInfo")
			this.order_id = option.order_id
			console.log(this.order_id, 'this.order_id')

			this.height = parseInt(uni.getSystemInfoSync().windowHeight) - this.height
			if (option.page == 'coupon') {
				this.coupocMsg = JSON.parse(this.options.coupon)
				console.log(this.coupocMsg, '优惠券使用活动情况')
			}
			if (this.options.page == 'preview') {
				this.itemAct = uni.getStorageSync('previewAct')
				this.$store.state.joinActShopAddre.forEach(item => {
					this.storeList.push(item)
				})
				this.fullTime(this.itemAct.end_date)

				if (this.options.actType == "group") {
					this.itemAct.group_purchase = [{
						quanlity_group_purchase: this.itemAct.quanlity_group_purchase, //	成团人数
						enable_virtual_group_purchase: this.itemAct.enable_virtual_group_purchase, //是否开启虚拟成团
						enable_head_welfare: this.itemAct.enable_head_welfare, //是否开启团长福利
						head_welfare_content: this.itemAct.head_welfare_content, //团长福利介绍
						show_other_group_purchase: this.itemAct.show_other_group_purchase, //是否在报名页面显示“参与他人的团”
						end_group_purchase_type: this.itemAct.end_group_purchase_type, //开启虚拟成团后，触发成团条件：0用户开团指定小时后自动成团，1活动结束自动成团
						refund_type: this.itemAct.refund_type, //	退款方式0不退款，1线下协商退款；
						end_group_purchase_hour: this.itemAct.end_group_purchase_hour, //多少小时自动成团，0活动自动结束
					}]
					this.isGroup = true
					this.quanlity_group_purchase = this.itemAct.group_purchase[0].quanlity_group_purchase
				} else if (this.options.actType == "discounts") {
					this.itemAct.group_purchase = []
					this.isGroup = false
				}
				console.log(this.itemAct, '111111111')
				this.itemAct.course_msg.forEach(item => {
					item.isCourseShow = false
					item.courseNum = '0'
				})
				this.storeList.forEach(item => {
					item.addressContent = item.province_id.province + '省' + item.city_id.city + item.country_id.country + item.address
				})
				console.log(this.storeList, 'this.storeList')
				this.itemAct.buyer = 0
			} else if (this.options.page == 'share') {
				console.log(this.options.actId, '分享获得的活动ID')
				this.buy_method = option.buy_method
				console.log(this.buy_method, '分享链接购买方式')
				// this.customer_id_share = option.customer_id
				if (isNaN(option.customer_id)) {
					uni.setStorageSync('shared_customer_id', 0)
				} else {
					uni.setStorageSync('shared_customer_id', parseInt(option.customer_id, 10))
				}

				console.log(option.customer_id, '分享者的customerid')
			}

			//  去除分享链接中分享者的token
			const stateObj = this.currentPge
			let pattern = /(&token+.*&)|(&token+.*)/
			this.currentPge = this.currentPge.replace(pattern, '&')
			history.replaceState(stateObj, "", this.currentPge)
		},
		
		onShow() {
			this.addUserStore()
			let pages = getCurrentPages()
			// #ifdef H5
				this.currentPge = pages[0].$route.fullPath
			// #endif
			this.courseAmount = 0
			this.totalOriginPrice = 0
			this.totalWholesalePayPrice = 0
			if (this.options.page == 'coupon') {
				this.getCoupocAct()
			} else if (this.options.page == 'details') {
				this.getActList()
			} else if (this.options.page == 'share') {
				this.getActList()
			}
			//如果用户已登录并且通过他人分享进入
			if (this.$store.getters.getToken && uni.getStorageSync('shared_customer_id')) {

				this.bindActivityRelation()
			}

			this.getBuy()
		},
		mounted() {
			// this.addToList();
		},
		methods: {
				addUserStore(){
					let data = {
						token:this.$store.getters.getToken,
						store_id: this.store_id,
						// #ifdef H5
							type:2
						// #endif
						// #ifdef MP-WEIXIN
							type:1
						// #endif
					}
					console.log("add_user_store",data);
					// 3.发送请求
					this.$api.add_user_store(data).then(res => {
						console.log("add_user_store",res);
						if(res.status){
							
						}else{
							uni.showToast({
								title:res.msg,
								icon:'none',
								duration:2000
							})
						}
					}).catch(err =>{
						console.log(err)
					})
				},
			getuserinfo() {
				
				//#ifdef MP-WEIXIN
				userLogin(this.share_id,this.invite_type,this.store_id,this.event_id).then((res)=>{
					console.log(res)
					console.log(555555)
					this.userInfo = uni.getStorageSync("userInfo")
					this.addUserStore()
					// this.videoId = this.event_id
					// this.getVideo()
				});	
				//#endif
			},
			// #ifdef MP-WEIXIN
				// 保存图片
				savepicture(){
					let that = this
					uni.authorize({
						scope: 'scope.writePhotosAlbum',
						success() {
							console.log(that.teacherWay.wechat_qrcode);
							uni.showModal({
								title: '提示',
								content: '确定保存到相册吗',
								success: function (res) {
									if (res.confirm) {
										uni.downloadFile({
											url: that.teacherWay.wechat_qrcode,//图片地址
											success: (res) =>{
												if (res.statusCode === 200){
													uni.saveImageToPhotosAlbum({
														filePath: res.tempFilePath,
														success: function() {
															uni.showToast({
																title: "保存成功",
																icon: "none"
															});
														},
														fail: function() {
															uni.showToast({
																title: "保存失败",
																icon: "none"
															});
														}
													});
												} 
											}
										})
									} else if (res.cancel) {
										
									}
								}
							});
						},
						fail() {
							uni.showModal({
								content: '拒绝授权相册权限后无法成功保存海报，是否重新授权？',
								confirmColor: '#00A66A',
								success: function (res) {
									if (res.confirm) {
										uni.openSetting({
											success(res) {
												console.log(res.authSetting)
											}
										});
									} else if (res.cancel) {
										
									}
								}
							})
						}
					})
				},
			// #endif
			jumpClues(){
				uni.navigateTo({
					url: '/pages/memberCenter/selectGoodCourses/activityClues?store_id=' + this.itemAct.store_id
				})
			},
			//#ifdef H5
			async inviteStaff(customer_info, item) {
				// uni.navigateTo({
				// 	url:'../../specialGroup/invite/inviteStaff?store_id=' + this.store_id + '&actId=' + this.activity_id
				// })
				let _self = this
				let signLink = /(Android)/i.test(navigator.userAgent) ? location.href : window.entryUrl;
				let data = {
					token: _self.$store.getters.getToken,
					url: signLink
				}
				// console.log(this.store_info,'1111111')
				try {

					let configData = JSON.parse((await this.$api.gain_share_data(data)).data)

					wx.config(configData)
					wx.ready(function() {
						wx.updateAppMessageShareData({
							title: item.name, // 分享标题
							desc: customer_info.nickname + '邀请您加入' + item.name + '活动', // 分享描述
							// link: location.href,
							link: _self.current_url() + '/pages/home/organization/activeDetail-3?store_id=' + _self.$store.getters.getStoreId +
								'&actId=' + item.activity_id + '&customer_id=' + customer_info.customer_id +
								'&page=share&buy_method=1', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
							imgUrl: item.image[0].image, // 分享图标
							success: function(res) {
								// 设置成功
								// alert(res)
							},
							fail: function(err) {
								// alert('error')
								console.log('wx.updateAppMessageShareData error');
							}
						})
					})

				} catch (e) {
					console.log(e)
				}
			},
			//#endif
			
			// addToList() {
			// 	 this.msg = this.msg1 + this.msg
			//  let list = [
			//  {
			//   id: this.id,
			//   avatar: this.avatar,
			//   msg: this.msg,
			//  }
			//  ];
			//  list.forEach((v) => {
			//  // this.barrageList.push({
			//  //  id: v.id,
			//  //  avatar: v.avatar,
			//  //  msg: v.msg,
			//  //  time: 5,
			//  //  type: MESSAGE_TYPE.NORMAL,
			//  //  // barrageStyle: v.barrageStyle
			//  // });
			//  });
			// },

			getBuy() {
				const data = {
					activity_id: this.options.actId,
				}

				this.$api.getBuyInfo(data).then(res => {
					console.log(res, '66666666666666')
					console.log(res.list[0], '55555555')
					let arr = []
					for (let i = 0; i < res.list.length; i++) {
						res.list[i].time = 5;
						res.list[i].msg = res.list[i].nickname + '参与了活动';
						res.list[i].type = MESSAGE_TYPE.NORMAL;

						console.log(res.list[i], '0000000000000');
						arr.push(res.list[i]);
					}
					console.log(arr[0].nickname, 'aaaaaaaaaaaaaaaaaaaaaaa');
					this.barrageList = arr
					console.log(this.barrageList, '----------------------------------');
					// console.log(list =	res.list,'this.barrageList')
					// console.log(list,'list')
					// res.list.forEach((v) => {
					// this.barrageList.push({
					//  id: customer_id,
					//  avatar: avatar,
					//  msg: nickname,
					// })
					// })
					// console.log(this.barrageList,'this.barrageList')
				}).catch(err => {
					console.log(err)
				})
			},
			getCustomer() {
				const data = {
					token: this.$store.getters.getToken,
					store_id: this.store_id
				}
				this.$api.getCustomerInfo(data).then(res => {
					if (res.status) {
						this.customer_info = res.data.userinfo
						this.inviteStaff(this.customer_info, this.itemAct)
						// this.$store.commit('updataUserInfo',this.customer_info.userinfo);
						// uni.setStorageSync('userInfo',this.customer_info.userinfo)
						//判断用户是否为店主
						// if(this.customer_info.role == 3){
						// this.is_current_store_owner = 1
						// }
						this.gainGroupInfo(data)
					}
				}).catch(err => {
					console.log(err)
				})
				// let customer_info = this.$api.getCustomerInfo(data)
				// console.log(this.customer_info)

			},
			// 获取所有活动信息
			getActList() {
				console.log(this.options.actId, 'this.options.actId')
				this.page = 1
				let data = {
					token: this.$store.getters.getToken,
					activity_id: this.options.actId
				}
				this.$api.gain_all_act(data).then(res => {
					console.log("活动信息",res);
					if (res.status) {
						this.itemAct = res.list.data[0]
						if (this.itemAct.music == 1) {
							if (this.musicAudio) {
								// this.musicAudio.play()
								let that = this
								// #ifdef H5
									wx.ready(function() {
										that.musicAudio.play();
									});
								// #endif
								// #ifdef MP-WEIXIN
									wx.playBackgroundAudio({
										dataUrl: that.music_url,
									})
								// #endif
							}
						}
						console.log(this.itemAct)
						this.fullTime(this.itemAct.end_date)
						if (parseInt(this.itemAct.allowed_total, 10) > 0) {
							this.width = Math.round((this.itemAct.virtual_total + this.itemAct.buyer) / this.itemAct.allowed_total *
								10000) / 100.00
						}
						this.width > 100 ? this.width = 100 : this.width = this.width
						if (this.width >= 92) {
							this.mWidth = 78
						} else {
							this.mWidth = this.width - 2 < 0 ? 0 : this.width - 2
						}

						let array = []
						this.itemAct.course_msg.forEach(item => {
							item.courseNum = '0'
							item.originPrice = 0
							item.wholesalePayPrice = 0
							item.all_salesroom.forEach(info => {
								if (info[0] != undefined) {
									array.push(info[0])
								}
							})
						})

						if (this.itemAct.activity_description.length != 0) {
							this.showActDetail = true
						} else {
							this.showActDetail = false
						}

						for (let i = 0; i < array.length; i++) {
							let flag = true
							for (let j = 0; j < this.storeList.length; j++) {
								if (this.storeList[j].customer_organization_salesroom_id == array[i].customer_organization_salesroom_id) {
									flag = false
								}
							}
							if (flag) {
								this.storeList.push(array[i])
							}
						}

						this.storeList.forEach(item => {
							item.addressContent = item.province_id + '省' + item.city_id + item.country_id + item.address
						})

						if (this.itemAct.group_purchase.length == 0) {
							this.isGroup = 'discount'
						} else {
							this.isGroup = 'group'
							if (this.itemAct.group_purchase[0].show_other_group_purchase == '1' || this.options.page == 'share') {
								this.isShowOtherGroup = true
							} else {
								this.isShowOtherGroup = false
							}
							this.enable_head_welfare = this.itemAct.group_purchase[0].enable_head_welfare
							this.head_welfare_content = this.itemAct.group_purchase[0].head_welfare_content
							this.quanlity_group_purchase = this.itemAct.group_purchase[0].quanlity_group_purchase
						}

						this.gainTeacher()
						if (this.$store.getters.getToken) {
							this.getCustomer()
						}
					} else {
						uni.showToast({
							title: res.msg,
							icon: "none",
							duration: 2000
						})
					}
				}).catch(err => {
					console.log(err)
				})



			},
			
			// 获取活动拼团信息
			gainGroupInfo() {
				let data = {
					token: this.$store.getters.getToken,
					activity_id: this.options.actId
				}
				this.$api.get_activity_group_list(data).then(res => {
					if (res.status) {
						let groupList = res.data.assemble
						this.groupInfo.myGroupList = groupList.filter(item =>
							// (item.consumer.find(element => element.customer_id == this.customer_info.customer_id) != '')&&item.status == 0)
							{
								let flag = false
								if (item.status == 0) {
									for (let i = 0; i < item.consumer.length; i++) {
										if (item.consumer[i].customer_id == this.customer_info.customer_id) {
											flag = true;
											break;
										}
									}
									return flag
								}
							})
						console.log(this.customer_info.customer_id, 'CCCCCCCCCCCCCCCCCCC');
						this.groupInfo.otherGropList = groupList.filter(item => {
							let flag = false
							if (item.status == 0) {
								if (item.consumer.filter(element => element.customer_id == this.customer_info.customer_id).length > 0) {
									flag = false
								} else {
									flag = true
								}
								// for(let i=0;i<item.consumer.length;i++){
								// 	if(item.consumer[i].customer_id != this.customer_info.customer_id){
								// 		flag = true
								// 	}
							}
							return flag
						})
						this.groupInfo.otherGropList = this.groupInfo.otherGropList.slice(0, 3)
						// 设置展示头像列表
						this.getVirtualAvatarList(this.itemAct.virtual_total, groupList)

						// this.avatarShowList.unshift(groupList.slice(1,10))
						// this.avatarShowList = this.avatarShowList.slice(1,10)
					}
				})
			},
			// 获取老师联系方式
			gainTeacher() {
				// return new Promise((resolve, reject) => {
				console.log("token-----", this.$store.getters.getToken)
				if (this.$store.getters.getToken) {
					let data
					if (this.options.page == 'share') {
						data = {
							token: this.$store.getters.getToken,
							activity_id: this.itemAct.activity_id,
							share_customer_id: uni.getStorageSync('shared_customer_id')
						}
					} else {
						data = {
							token: this.$store.getters.getToken,
							activity_id: this.itemAct.activity_id
						}
					}
					this.$api.gain_teacher_contact(data).then(res => {
						console.log(res)
						if (res.status) {
							this.teacherWay = res.data
							this.teacherWay.changePhone = this.teacherWay.telephone.replace(/(^\d{3}|\d{4}\B)/g, "$1-")
						}
					}).catch(err => {
						reject()
						console.log(err)
					})
				} else {
					// location.href = this.$store.state.URL + "/customer/user/wx_login?page=" + this.currentPge + '&actId=' + this.options
					// 	.actId + '&shared_customer_id=' + uni.getStorageSync('shared_customer_id')
				}
				// })
			},
			// 获取活动拼团信息
			getActiveGroupList() {
				this.$api.get_activity_group_list()
			},
			callPhone() {
				uni.makePhoneCall({
					phoneNumber: this.teacherWay.telephone,
					success(res) {
						console.log(res)
					},
					fail(err) {
						console.log(err)
					}
				})
			},
			sharePoster() {
				if (this.options.page == "preview") {
					uni.showToast({
						title: '预览界面不可操作',
						icon: 'none',
						duration: 2000
					})
					return false
				}
				console.log(this.currentPge, 'this.currentPge')
				if (this.$store.getters.getToken) {
					uni.setStorageSync('shareAct', this.itemAct)
					uni.navigateTo({
						url: 'shaerPoster/shaerPoster?store_id=' + this.store_id + '&actId=' + this.itemAct.activity_id
					})
				} else {
					// location.href = this.$store.state.URL + "/customer/user/wx_login?page=" + this.currentPge + '&actId=' + this.options
					// 	.actId + '&shared_customer_id=' + uni.getStorageSync('shared_customer_id')
				}
			},
			reduceNum(item) {
				let giveNum = 0
				if (this.options.page == "preview") {
					uni.showToast({
						title: '预览界面不可操作',
						icon: 'none',
						duration: 2000
					})
					return false
				}
				if (item.courseNum == '0') {
					item.originPrice = 0
					item.wholesalePayPrice = 0
					return false
				} else {
					item.courseNum--
					this.courseAmount--
					item.originPrice = item.originPrice - 1 * item.special_price
					item.wholesalePayPrice = item.wholesalePayPrice - 1 * item.group_purchase_price
					this.totalOriginPrice = this.totalOriginPrice - 1 * item.special_price
					this.totalWholesalePayPrice = this.totalWholesalePayPrice - 1 * item.group_purchase_price
					if (this.courseAmount == 0) {
						this.totalOriginPrice = 0
						this.totalWholesalePayPrice = 0
					}
					// giveNum = parseInt(this.courseAmount/(this.itemAct.give_course + this.itemAct.purchase_course))
					// console.log(this.courseAmount == (this.itemAct.give_course + this.itemAct.purchase_course)*(giveNum+1) - 1)
					// if(this.courseAmount == (this.itemAct.give_course + this.itemAct.purchase_course)*(giveNum+1) - this.itemAct.purchase_course){
					// 	this.isShowGiveTooltip = true
					// }else{
					// 	this.isShowGiveTooltip = false
					// }
				}
			},
			addNum(item) {
				let giveNum = 0 //赠送数量值
				// let course = []
				if (this.options.page == "preview") {
					uni.showToast({
						title: '预览界面不可操作',
						icon: 'none',
						duration: 2000
					})
					return false
				}
				if (item.limit_course != 0) {
					if (item.courseNum >= item.limit_course) {
						uni.showToast({
							title: '仅允许报' + item.limit_course + '次',
							icon: 'none',
							duration: 2000
						})
						return false
					} else {
						parseInt(item.courseNum++)
						this.courseAmount = this.courseAmount + 1
						item.originPrice = item.originPrice + 1 * item.special_price
						item.wholesalePayPrice = item.wholesalePayPrice + 1 * item.group_purchase_price
						this.totalOriginPrice = this.totalOriginPrice + 1 * item.special_price
						this.totalWholesalePayPrice = this.totalWholesalePayPrice + 1 * item.group_purchase_price
						// if(this.itemAct.enable_purchase_course_then_give_course == 1){
						// 	giveNum = parseInt(this.courseAmount/(this.itemAct.give_course + this.itemAct.purchase_course))
						// 	if(this.courseAmount == (this.itemAct.give_course + this.itemAct.purchase_course)*(giveNum+1) - this.itemAct.purchase_course){
						// 		this.isShowGiveTooltip = true
						// 	}else{
						// 		this.isShowGiveTooltip = false
						// 	}
						// }
					}
				} else {
					parseInt(item.courseNum++)
					this.courseAmount = this.courseAmount + 1
					item.originPrice = item.originPrice + 1 * item.special_price
					item.wholesalePayPrice = item.wholesalePayPrice + 1 * item.group_purchase_price
					this.totalOriginPrice = this.totalOriginPrice + 1 * item.special_price
					this.totalWholesalePayPrice = this.totalWholesalePayPrice + 1 * item.group_purchase_price
					// if(this.itemAct.enable_purchase_course_then_give_course == 1){
					// 	giveNum = parseInt(this.courseAmount/(this.itemAct.give_course + this.itemAct.purchase_course))
					// 	if(this.courseAmount == (this.itemAct.give_course + this.itemAct.purchase_course)*(giveNum+1) - this.itemAct.purchase_course){
					// 		this.isShowGiveTooltip = true
					// 	}else{
					// 		this.isShowGiveTooltip = false
					// 	}
					// }
				}

			},
			carPopup() {
				if (this.options.page == "preview") {
					uni.showToast({
						title: '预览界面不可操作',
						icon: 'none',
						duration: 2000
					})
					return false
				}
				console.log('kkkkk');
				this.$refs.shoppingPopup.open()
			},
			carPopupClose() {
				this.$refs.shoppingPopup.close()
			},
			joinOhter() {
				if (this.$store.getters.getToken) {
					this.$refs.shoppingPopup.close()
					if (this.itemAct.allowed_total - this.itemAct.buyer <= 0) {
						uni.showToast({
							title: '名额已用完,请联系老师！',
							icon: 'none',
							duration: 2000
						})
						return false
					}
					if (this.startEnd == 0) {
						uni.showToast({
							title: '活动已结束',
							icon: 'none',
							duration: 2000
						})
						return false
					}
					if (this.options.page == "preview") {
						uni.showToast({
							title: '预览界面不可操作',
							icon: 'none',
							duration: 2000
						})
						return false
					}

					// this.itemAct.course_msg.length > '1' 多课情况
					if (this.courseAmount == 0 && this.itemAct.course_msg.length > '1') {
						uni.showToast({
							title: '请选择报名课程',
							icon: 'none',
							duration: 2000
						})
						return false
					} else if (this.itemAct.course_msg.length == '1') {
						// 单课情况
						this.itemAct.course_msg[0].courseNum = '1'
					}
					// if(this.itemAct.enable_allowed_purchase_quantity== 1){
					// 	if(this.courseAmount>this.itemAct.allowed_purchase_quantity){
					// 		uni.showToast({
					// 			title:'本活动限报' + this.itemAct.allowed_purchase_quantity + '个课程',
					// 			icon:'none',
					// 			duration:2000
					// 		})
					// 		return false
					// 	}
					// }
					uni.setStorageSync('buyActCouse', this.itemAct)
					if (this.itemAct.group_purchase.length == 0) {
						this.is_group = 'discount'
					} else {
						this.is_group = 'group'
					}
					uni.setStorageSync('order_id', this.order_id);

					uni.navigateTo({
						url: '../order/ordersSubmitted-kpp?is_group=' + this.is_group + '&special=group_purchase_price&store_id=' + this.store_id +
							'&group_type=other_group&order_id=' + this.order_id + '&page=' + this.options.page + '&customer_id=' + this.options
							.customer_id
					})
				} else {
					// location.href = this.$store.state.URL + "/customer/user/wx_login?page=" + this.currentPge + '&actId=' + this.options
					// 	.actId + '&shared_customer_id=' + uni.getStorageSync('shared_customer_id')
				}
			},
			joinGroup() {
				if (this.$store.getters.getToken) {
					if (this.startEnd == 0) {
						uni.showToast({
							title: '活动已结束',
							icon: 'none',
							duration: 2000
						})
						return false
					}
					this.$refs.shoppingPopup.close()
					if (this.options.page == "preview") {
						uni.showToast({
							title: '预览界面不可操作',
							icon: 'none',
							duration: 2000
						})
						return false
					}
					// this.itemAct.course_msg.length > '1' 多课情况
					if (this.courseAmount == 0 && this.itemAct.course_msg.length > '1') {
						uni.showToast({
							title: '请选择报名课程',
							icon: 'none',
							duration: 2000
						})
						return false
					} else if (this.itemAct.course_msg.length == '1') {
						// 单课情况
						this.itemAct.course_msg[0].courseNum = '1'
					}
					// if(this.itemAct.enable_allowed_purchase_quantity== 1){
					// 	if(this.courseAmount>this.itemAct.allowed_purchase_quantity){
					// 		uni.showToast({
					// 			title:'本活动限报' + this.itemAct.allowed_purchase_quantity + '个课程',
					// 			icon:'none',
					// 			duration:2000
					// 		})
					// 		return false
					// 	}
					// }
					this.itemAct['order_id'] = this.order_id
					uni.setStorageSync('buyActCouse', this.itemAct)
					if (this.itemAct.group_purchase.length == 0) {
						this.is_group = 'discount'
					} else {
						this.is_group = 'group'
					}
					uni.setStorageSync('order_id', this.order_id);
					uni.navigateTo({
						url: '../order/ordersSubmitted-kpp?is_group=' + this.is_group + '&special=group_purchase_price&store_id=' + this.store_id +
							'&group_type=alone_group'
					})
				} else {
					// location.href = this.$store.state.URL + "/customer/user/wx_login?page=" + this.currentPge + '&actId=' + this.options
					// 	.actId + '&shared_customer_id=' + uni.getStorageSync('shared_customer_id')
				}
			},
			joinOneGroup(data) {
				console.log(data, 'AAAAAAAAAAAAAAAAAAAAAA');
				if (this.$store.getters.getToken) {
					if (this.startEnd == 0) {
						uni.showToast({
							title: '活动已结束',
							icon: 'none',
							duration: 2000
						})
						return false
					}
					this.$refs.shoppingPopup.close()
					if (this.options.page == "preview") {
						uni.showToast({
							title: '预览界面不可操作',
							icon: 'none',
							duration: 2000
						})
						return false
					}
					// if(this.courseAmount == 0){
					// 	uni.showToast({
					// 		title:'请选择报名课程',
					// 		icon:'none',
					// 		duration:2000
					// 	})
					// 	return false
					// }
					// if(this.itemAct.enable_allowed_purchase_quantity== 1){
					// 	if(this.courseAmount>this.itemAct.allowed_purchase_quantity){
					// 		uni.showToast({
					// 			title:'本活动限报' + this.itemAct.allowed_purchase_quantity + '个课程',
					// 			icon:'none',
					// 			duration:2000
					// 		})
					// 		return false
					// 	}
					// }

					// 补充参团数据
					this.itemAct['main_order_id'] = data.main_order_id
					console.log(this.itemAct, 'IIIIIIIIAAAAAAAAAAAAAAA');
					data.assemble_course_msg.forEach(item => {
						item['courseNum'] = item.quantity
					})
					this.itemAct.course_msg = data.assemble_course_msg
					uni.setStorageSync('buyActCouse', this.itemAct)
					if (this.itemAct.group_purchase.length == 0) {
						this.is_group = 'discount'
					} else {
						this.is_group = 'group'
					}
					uni.setStorageSync('order_id', this.order_id);
					uni.navigateTo({
						url: '../order/ordersSubmitted-kpp?is_group=' + this.is_group + '&special=group_purchase_price&store_id=' + this.store_id +
							'&group_type=alone_group'
					})
				} else {
					// location.href = this.$store.state.URL + "/customer/user/wx_login?page=" + this.currentPge + '&actId=' + this.options
					// 	.actId + '&shared_customer_id=' + uni.getStorageSync('shared_customer_id')
				}
			},
			toActiveGroup() {
				uni.navigateTo({
					url: "./activeGroup"
				})
			},
			// 活动倒计时时间转换
			fullTime(end) {
				let _that = this;
				_that.t1 = setInterval(() => {
					let endTime = parseInt(new Date(end.replace(/-/g, '/')).getTime(), 10);
					let time = new Date();
					if (endTime > time) {
						_that.currentTime = parseInt(time.getTime(), 10);
						_that.startEnd = parseInt((endTime - _that.currentTime) / 1000, 10);
						_that.d = parseInt(_that.startEnd / (24 * 60 * 60), 10);
						_that.h = parseInt((_that.startEnd / (60 * 60)) % 24, 10);
						_that.min = parseInt((_that.startEnd / 60) % 60, 10);
						_that.sec = parseInt(_that.startEnd % 60, 10);
						if (_that.d < 10) {
							_that.d = '0' + _that.d;
						}
						if (_that.h < 10) {
							_that.h = '0' + _that.h;
						}
						if (_that.min < 10) {
							_that.min = '0' + _that.min;
						}
						if (_that.sec < 10) {
							_that.sec = '0' + _that.sec;
						}
						if (_that.startEnd == '0') {
							clearInterval(_that.t1);
						}
					} else {
						this.startEnd = 0
						uni.showToast({
							title: '活动己结束',
							icon: 'none',
							duration: 2000
						});
						this.actTime = false;
						clearInterval(this.t1);
						// setTimeout(() => {
						// 	uni.redirectTo({
						// 		url: '/pages/home/home?store_id' + this.store_id
						// 	});
						// }, 1000);
					}
				}, 1000);
			},
			bindActivityRelation() {

				let data = {
					token: this.$store.getters.getToken,
					shared_customer_id: uni.getStorageSync('shared_customer_id'),
					activity_id: this.options.actId,
				}
				this.$api.bind_activity_relation(data).then(res => {
					console.log(res)
					if (res.status) {

					} else {
						uni.showToast({
							title: res.msg,
							icon: "none",
							duration: 2000
						})
					}
				}).catch(err => {
					console.log(err)
				})
			},
			// 打开联系老师弹窗
			opConcatPop() {
				this.$refs.contactTeacherPopup.open()
			},
			// #ifdef H5
				// 复制
				copyData(copyText) {
					console.log('点击了复制');
					let content = copyText // 复制内容，必须字符串，数字需要转换为字符串
					const result = h5Copy(content)
					if (result === false) {
						uni.showToast({
							title: '不支持',
						})
					} else {
						uni.showToast({
							title: '复制成功',
							icon: 'none'
						})
					}
				},
			// #endif
			// #ifdef MP-WEIXIN
				copyData(wechatNumber) {
					uni.setClipboardData({
						data: wechatNumber,
						success: function (res) {
							uni.getClipboardData({
								success: function (res) {
									console.log(res.data) // data
								}
							})
						}
					})
				},
			// #endif
			// 获取虚拟头像列表
			getVirtualAvatarList(num, groupList) {
				if (num > 10 && num < 50) {
					num = 10
				} else if (num >= 50) {
					num = 50
				}
				let params = {
					token: this.$store.getters.getToken,
					Number: num
				}
				this.$api.getVirtualAvatarList(params).then(res => {
					groupList.forEach(item => {
						let data = {
							avatar: item.leader.avatar,
							nickname: item.leader.nickname
						}
						this.avatarShowList.push(data)
						this.swiperPurchaseList.push(data)

					})
					if (res.status) {
						res.list.forEach(item => {
							item['avatar'] = item.img_url,
								item['nickname'] = item.name
						})
						res.list.forEach(item => {
							this.avatarShowList.push(item)
							this.swiperPurchaseList.push(item)
						})

						this.swiperPurchaseList = this.swiperPurchaseList
						this.avatarShowList = this.avatarShowList.slice(0, 10).reverse()
					}
				})
			},
			// 获取音乐
			getMusic() {
				let param = {
					token: this.$store.getters.getToken,
				}
				this.$api.getMusic(param).then(res => {
					if (res.status) {
						this.music_url = res.data[0].music
						// #ifdef MP-WEIXIN
							wx.playBackgroundAudio({
								dataUrl: this.music_url,
							})
						// #endif
						this.musicAudio = new Howl({
							src: [this.music_url],
							html5: true,
							autoplay: true,
							loop: true,
						})
					}
				})
			},
			// 控制音乐开关
			// #ifdef MP-WEIXIN
				changMusicStatus() {
					let that = this
					this.isMusicOn = !this.isMusicOn
					
					// let manager = wx.getBackgroundAudioManager();
					if (this.isMusicOn) {
						wx.playBackgroundAudio({
							dataUrl: that.music_url,
						})
					} else {
						wx.pauseBackgroundAudio()
					}
				},
			// #endif
			//#ifdef H5
			changMusicStatus() {
				this.isMusicOn = !this.isMusicOn
				if (this.isMusicOn) {
					let that = this
					// wx.config({
					// 	// 配置信息, 即使不正确也能使用 wx.ready
					// 	debug: false,
					// 	appId: '',
					// 	timestamp: 1,
					// 	nonceStr: '',
					// 	signature: '',
					// 	jsApiList: []
					// });
					wx.ready(function() {
						that.musicAudio.play();
					});
				} else {
					let that = this
					wx.ready(function() {
						that.musicAudio.pause();
					});
				}
				console.log(this.isMusicOn, 'MMMMOOOOOOOOOOOOOO');

			},
			//#endif
			
			backHome() {
				uni.navigateTo({
					url: '../home?store_id=' + this.store_id
				})
			},
		},
		onHide() {
			console.log('OnHide destory');
			this.musicAudio.stop()
			// #ifdef MP-WEIXIN
				wx.stopBackgroundAudio()
			// #endif
		},
		beforeDestroy() {
			console.log('beforeDestroy destory');
			this.musicAudio.stop()
			// #ifdef MP-WEIXIN
				wx.stopBackgroundAudio()
			// #endif
		},
		destroyed() {
			setTimeout(() => {
				this.musicAudio.pause()
			}, 500)
			// #ifdef MP-WEIXIN
				wx.stopBackgroundAudio()
			// #endif
			console.log('destroyed destory');
		},
		onUnload() {
			console.log('onUnload destory');
			this.musicAudio.stop()
			// #ifdef MP-WEIXIN
				wx.stopBackgroundAudio()
			// #endif
		},
		onBackPress(options) {
			console.log('onBackPress destory');
			this.musicAudio.stop()
			// #ifdef MP-WEIXIN
				wx.stopBackgroundAudio()
			// #endif
		},

	};
</script>

<style scoped>
	page {
		background: #f3f3f4;
	}

	.small-font {
		font-size: 24rpx;
	}

	.medium-font {
		font-size: 28rpx;
	}

	.normal-font {
		font-size: 40rpx;
	}

	.content-wrap {
		width: 100%;
	}

	/* 右上浮动按钮 start */
	.top-float view image {
		height: 88rpx;
		width: 88rpx;
		margin-bottom: 40rpx;
	}

	.top-float {
		position: fixed;
		z-index: 888;
		top: 20rpx;
		right: 20rpx;
	}

	.top-float .music-active image {
		-webkit-animation: spin 2s linear 2s 5 alternate;
		animation: spin 1.5s linear infinite;
	}

	.go-home image {
		border-radius: 50%;
		border: 1upx solid #DEDEDE;
	}


	@-webkit-keyframes spin {
		from {
			-webkit-transform: rotate(360deg);
		}

		to {
			-webkit-transform: rotate(0deg);
		}
	}

	@keyframes spin {
		from {
			transform: rotate(0deg);
		}

		to {
			transform: rotate(360deg);
		}
	}

	/* 右上浮动按钮 end */
	/* 图片 start */
	.top {
		width: 100%;
		background: #ffffff;
		margin-bottom: 20rpx;
	}

	.img-wrap {
		width: 100%;
	}

	.img-wrap .swiper {
		width: 100%;
		height: 1060rpx;
	}

	.top-img {
		width: 100%;
		height: 100%;
	}

	/* 图片 end */
	/* 倒计时 start */
	.active-time-wrap {
		display: flex;
		height: 160rpx;
		padding: 20rpx;
		box-sizing: border-box;
		background: #d23737;
		color: #ffffff;
	}

	.active-time-wrap .left {
		flex: 4;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		border-right: 1rpx solid rgba(255, 255, 255, 0.7);
	}

	.active-time-wrap .center {
		flex: 3;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		padding: 0 30rpx 6rpx 30rpx;
		border-right: 1rpx solid rgba(255, 255, 255, 0.7);
	}

	.active-time-wrap .right {
		flex: 7;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		padding-left: 30rpx;
	}

	.active-time-wrap .right .countdown {
		font-size: 22rpx;
		margin-bottom: 20rpx;
	}

	.active-time-wrap .right .countdown view {
		display: inline-block;
		height: 44rpx;
		width: 48rpx;
		margin: 0 6rpx;
		font-size: 26rpx;
		color: #ff391f;
		background: #feefe3;
		border-radius: 8rpx;
		text-align: center;
		line-height: 44rpx;
	}

	/* 倒计时 end */

	.top .active-title {
		width: 100%;
		font-size: 34rpx;
		padding: 20rpx;
		box-sizing: border-box;
		word-wrap: break-word;
	}

	/* 主体详情 start*/
	.main {
		background: #ffffff;
		padding-bottom: 240rpx;
	}

	/* 参与人员头像 start */
	.join-peopel-wrap {
		display: flex;
		justify-content: center;
		margin: 20rpx;
		padding: 20rpx;
		box-sizing: border-box;
		border-bottom: 2rpx solid #eee;
	}

	.join-avatar-item {
		display: inline-block;
	}

	.join-avatar-item image {
		height: 48rpx;
		width: 48rpx;
		border-radius: 50%;
	}

	.join-avatar-item:not(:first-child) {
		margin-left: -15rpx;
	}

	.join-peopel-right {
		font-size: 18px;
		color: #666;
	}

	.join-peopel-right .num {
		font-size: 36rpx;
		color: #ff391f;
		font-weight: bold;
	}

	/* 参与人员头像 end */

	/* 参团 start */
	.group-wrap {
		border-bottom: 20rpx solid #eee;
	}

	.my-group {
		margin-bottom: 20rpx;
	}

	.my-group-border:after {
		content: '';
		display: block;
		margin: 0 20rpx;
		margin-top: 30rpx;
		border-bottom: 1px solid #eee;
	}

	.my-group .my-group-header {
		display: flex;
		justify-content: center;
		height: 42rpx;
		color: #ff8b46;
	}

	.my-group .my-group-header-left {
		height: 2rpx;
		width: 200rpx;
		margin: auto 0;
		margin-right: 20rpx;
		background-image: linear-gradient(90deg, rgba(255, 191, 124, 0) 0%, #ff8b46 100%);
	}

	.my-group .my-group-header-right {
		height: 2rpx;
		width: 200rpx;
		margin: auto 0;
		margin-left: 20rpx;
		transform: scaleX(-1);
		background-image: linear-gradient(90deg, rgba(255, 191, 124, 0) 0%, #ff8b46 100%);
	}

	.my-group-list {
		margin: 0 20rpx;
	}

	.my-group-item {
		display: flex;
		justify-content: space-between;
		height: 60rpx;
		margin-top: 30rpx;
		margin-bottom: 30rpx;
	}

	.my-group-item image {
		border-radius: 50%;
		margin-right: 10rpx;
		margin-left: 20rpx;
	}

	.my-group-item:last-child {
		display: flex;
		justify-content: space-between;
		height: 60rpx;
		margin-bottom: 10rpx;
	}

	.my-group-item .left {
		width: 200rpx;
	}

	.my-group-item .right {
		width: 200rpx;
	}

	.my-group-item image {
		height: 48rpx;
		width: 48rpx;
		vertical-align: middle;
	}

	.my-group-item .center {
		flex: 1;
		text-align: center;
	}

	.my-group-item .center .top-tip {
		font-size: 22rpx;
		margin-top: -10rpx;
		margin-bottom: 10rpx;
	}

	.my-group-item .center .top-tip .text {
		color: #f86363;
		margin-left: 20rpx;
	}

	.my-group-item .center progress {
		border-radius: 20rpx;
		overflow: hidden;
	}

	.my-group-item .right .invite-btn {
		height: 40rpx;
		width: 140rpx;
		margin-top: 12rpx;
		margin-left: 30rpx;
		font-size: 22rpx;
		line-height: 40rpx;
		text-align: center;
		background: #f86363;
		color: #ffffff;
		border-radius: 20rpx;
	}

	.view-more {
		text-align: center;
		padding-bottom: 20rpx;
		color: #55a0f0;
	}

	/* 参团 end */

	/* 活动课程 start */
	.active-course-wrap {
		position: relative;
		padding-top: 70rpx;
		padding-bottom: 60rpx;
		border-bottom: 20rpx #eee solid;
	}

	.active-course-top .top-bg {
		position: absolute;
		height: 64rpx;
		width: 248rpx;
		top: -4rpx;
		left: 50%;
		transform: translateX(-50%);
	}

	.active-course-top .top-title {
		position: absolute;
		height: 64rpx;
		color: #ffffff;
		top: 8rpx;
		font-size: 30rpx;
		left: 50%;
		transform: translateX(-50%);
	}

	.active-course-item {
		width: 690rpx;
		margin: 0 auto;
		box-shadow: 0 1px 11px 0 rgba(0, 0, 0, 0.09);
		padding: 15px 20rpx 20rpx 20rpx;
		box-sizing: border-box;
		margin-top: 30rpx;
	}

	.active-course-item:not(:first-child) {
		margin-top: 44rpx;
	}

	.active-course-item .course-index-wrap {
		position: relative;
	}

	.active-course-item .course-index-wrap image {
		width: 144rpx;
		height: 60rpx;
		position: absolute;
		top: -60rpx;
		left: -32rpx;
	}

	.active-course-item .course-index-wrap .course-index {
		font-size: 28rpx;
		color: #FFFFFF;
		position: absolute;
		top: -54rpx;
		left: 0rpx;
	}

	.course-price-wrap {
		display: flex;
		justify-content: space-between;
		font-size: 32rpx;
		color: #333;
		margin: 20rpx 0;
		padding: 0 10rpx;
	}

	.course-price-wrap .active-price .text {
		font-size: 40rpx;
		margin-left: 10rpx;
		color: #FF391F;
	}

	.active-course-item .course-title {
		font-size: 32rpx;
		color: #333333;
	}

	.buy-num-wrap {
		display: flex;
		justify-content: space-between;
		margin: 0 10rpx;

	}

	.buy-num-wrap .sub-buy-btn {
		height: 60rpx;
		width: 254rpx;
		line-height: 60rpx;
		text-align: center;
		color: #FF8B46;
		border: 1px solid #FF8B46;
		font-size: 26rpx;
		border-radius: 15px;
	}

	.buy-num-wrap .sub-buy-btn image,
	.buy-num-wrap .add-buy-btn image {
		height: 32rpx;
		width: 32rpx;
		vertical-align: text-top;
		margin-right: 10rpx;
	}

	.buy-num-wrap .buy-num {
		height: 60rpx;
		width: 110rpx;
		line-height: 60rpx;
		text-align: center;
		color: #FF6B4E;
		background: #FFE6E1;
		border: 1rpx solid #FF6B4E;
		font-size: 40rpx;
		border-radius: 30rpx;
		margin: 0 10rpx;
	}

	.buy-num-wrap .add-buy-btn {
		height: 60rpx;
		width: 254rpx;
		line-height: 60rpx;
		text-align: center;
		background-image: linear-gradient(90deg, #FE9543 14%, #FF664F 100%);
		color: #FFFFFF;
		font-size: 26rpx;
		border-radius: 30rpx;
		animation: animation 1501ms linear infinite both;
	}

	.animation-target {
		animation: animation 1501ms linear infinite both;
	}
	
	//#ifdef H5
	@keyframes animation {
		-0.03% {
			transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		}

		0% {
			transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		}

		0.07% {
			transform: matrix3d(0.8, 0, 0, 0, 0, 0.8, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		}

		2.67% {
			transform: matrix3d(0.855, 0, 0, 0, 0, 0.855, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		}

		5.27% {
			transform: matrix3d(0.897, 0, 0, 0, 0, 0.897, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		}

		10.37% {
			transform: matrix3d(0.95, 0, 0, 0, 0, 0.95, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		}

		15.57% {
			transform: matrix3d(0.978, 0, 0, 0, 0, 0.978, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		}

		20.67% {
			transform: matrix3d(0.991, 0, 0, 0, 0, 0.991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		}

		30.98% {
			transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		}

		41.28% {
			transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		}

		100% {
			transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
		}
	}
	//#endif
	

	/* 活动课程 end */

	/* 联系老师 start */
	.contact-teacher-wrap {
		position: relative;
		padding-top: 70rpx;
		padding-bottom: 60rpx;
		border-bottom: 20rpx #eee solid;
	}

	.contact-teacher-top .top-bg {
		position: absolute;
		height: 64rpx;
		width: 248rpx;
		top: -4rpx;
		left: 50%;
		transform: translateX(-50%);
	}

	.contact-teacher-top .top-title {
		position: absolute;
		height: 64rpx;
		color: #ffffff;
		top: 8rpx;
		font-size: 30rpx;
		left: 50%;
		transform: translateX(-50%);
	}

	.contact-teacher-tip {
		font-size: 32rpx;
		color: #333;
		text-align: center;
	}

	.teacher-code-warp {
		text-align: center;
	}

	.teacher-code {
		border: 1rpx solid #cdcdcd;
		border-radius: 16rpx;
		margin: 24rpx 30rpx;
	}

	.teacher-phone {
		color: #333;
		font-size: 32rpx;
		font-weight: bold;
		text-align: center;
		margin: 20rpx 0;
	}

	.call-phone-btn {
		height: 48rpx;
		width: 140rpx;
		margin: 0 auto;
		font-size: 26rpx;
		color: #ffffff;
		line-height: 48rpx;
		text-align: center;
		background-image: linear-gradient(90deg, #fe9543 14%, #ff664f 100%);
		border-radius: 15px;
		border-radius: 15px;
	}

	/* 联系老师 end */

	/* 活动介绍 start */
	.active-detail-wrap {
		position: relative;
		padding: 80rpx 20rpx 20rpx 20rpx;
		border-bottom: 20rpx #eee solid;
	}

	.active-detail-top .top-bg {
		position: absolute;
		height: 64rpx;
		width: 248rpx;
		top: -4rpx;
		left: 50%;
		transform: translateX(-50%);
	}

	.active-detail-top .top-title {
		position: absolute;
		height: 64rpx;
		color: #ffffff;
		top: 8rpx;
		font-size: 30rpx;
		left: 50%;
		transform: translateX(-50%);
	}

	.active-detail-item {
		font-size: 32rpx;
		padding-top: 20rpx;
	}

	.course-index {
		color: #ff674f;
	}

	.active-detail-item .course-img {
		margin-top: 20rpx;
	}

	.active-detail-item .course-img image {
		width: 100%;
	}

	.active-detail-item .course-content-img image {
		width: 100%;
	}

	/* 活动介绍 end */

	/* 门店活动地址 start */
	.store-address-wrap {
		position: relative;
		padding: 80rpx 20rpx 20rpx 20rpx;
		border-bottom: 20rpx #eee solid;
	}

	.store-address-top .top-bg {
		position: absolute;
		height: 64rpx;
		width: 248rpx;
		top: -4rpx;
		left: 50%;
		transform: translateX(-50%);
	}

	.store-address-top .top-title {
		position: absolute;
		height: 64rpx;
		color: #ffffff;
		top: 8rpx;
		font-size: 30rpx;
		left: 50%;
		transform: translateX(-50%);
	}

	.store-address-wrap .top-tip {
		text-align: center;
		font-size: 14px;
		color: #666;
	}

	.store-address-item {
		display: flex;
		height: 84rpx;
		justify-content: space-between;
		padding: 0 20rpx;
		align-items: center;
		border-bottom: 2rpx solid #ee;
	}

	.store-address-left .store-name {
		height: 48rpx;
		width: 80rpx;
		text-align: center;
		line-height: 48rpx;
		font-size: 28rpx;
		background: #ffffff;
		color: #ff8b46;
		border: 1px solid #ff8b46;
		border-radius: 2px;
		overflow: hidden; //超出的文本隐藏
		text-overflow: ellipsis; //溢出用省略号显示
		white-space: nowrap; //溢出不换行
	}

	.store-address-center .store-address {
		font-size: 30rpx;
		margin: 20rpx;
	}

	.store-address-right image {
		height: 48rpx;
		width: 38rpx;
	}

	/* 门店活动地址 end */

	/* 主体详情 end*/

	/* 底部栏 start */
	.floor {
		position: fixed;
		bottom: 0;
		background: #ffffff;
		display: flex;
		justify-content: space-between;
		align-items: center;
		height: 112rpx;
		width: 100vw;
	}

	/* 购物车样式 */
	.popup_shopping {
		width: 100%;
		/* height: 100%; */
		padding-top: 30upx;
		box-sizing: border-box;
		background: #F5F5F5;
	}

	.popup_shopping-content {
		width: 100%;
		/* height: 70%; */
		background: #FFFFFF;
		padding: 0 30upx;
		padding-bottom: 112rpx;
		box-sizing: border-box;
	}

	.popup_shopping-details {
		width: 100%;
		height: 288upx;
		background: #FFFFFF;
		box-shadow: 0 2upx 22upx rgba(0, 0, 0, 0.09);
		border-radius: 10upx;
		margin-top: 0upx;
		padding: 0 20rpx;
		box-sizing: border-box;
	}

	.popup_shopping-title {
		color: #333333;
		font-size: 30upx;
	}

	.popup_shopping-content .active-course-item {
		width: 600rpx;
	}

	.popup_shopping-content .active-course-item .buy-num {
		margin: 0 10rpx;
	}

	/* 购物车样式 end */
	.shop-course {
		margin-left: 36upx;
		margin-top: 18upx;
		margin-right: 20upx;
	}

	.shop-course>view:first-child {
		position: relative;
		/* margin: 0 auto; */
		height: 56upx;
	}

	.shop-course>view>image {
		width: 56upx;
		height: 56upx;
		margin-left: 4upx;
	}

	.shop-course>view>text {
		display: inline-block;
		width: 28upx;
		height: 28upx;
		border-radius: 50%;
		background: #FF391F;
		color: #FFFFFF;
		font-size: 24upx;
		line-height: 28upx;
		text-align: center;
		position: absolute;
		top: 0;
		right: 4upx;
	}

	.shop-course>view:last-child {
		color: #999999;
		font-size: 20upx;
		margin-top: 6upx;
	}

	.floor-float {
		display: flex;
		justify-content: flex-end;
		margin-bottom: 20rpx;
		position: absolute;
		top: -110rpx;
		width: 100vw;
	}


	.floor-float .my-join-group {
		height: 80rpx;
		width: 294rpx;
		border-radius: 40rpx;
		text-align: center;
		line-height: 80rpx;
		border: 1px solid #ff8b46;
		background: #ffffff;
		color: #ff8b46;
		font-size: 28rpx;
	}

	.floor-float .my-join-group span {
		margin-left: 10rpx;
		color: #f86363;
	}

	.floor-float .swiper-wrap {
		height: 80rpx;
		width: 294rpx;
		line-height: 80rpx;
		text-align: center;
		border-radius: 40rpx;
		background: rgba(0, 0, 0, 0.7);
	}

	.floor-float .float-item:last-child {
		margin-left: 60rpx;
		margin-right: 60rpx;
	}

	.floor-float .swiper {
		height: 80rpx;
	}

	.floor-float .swiper-item {
		display: flex;
		justify-content: space-evenly;
		align-items: center;
		font-size: 28rpx;
		color: #ffffff;
		margin: 0 auto;
		width: 280rpx;
	}

	.floor-float .swiper image {
		height: 48rpx;
		width: 48rpx;
		border-radius: 50%;
		border: 2rpx solid #ffffff;
	}

	.floor-left {
		flex: 1;
		position: relative;
		z-index: 999;
	}

	.floor-left image {
		height: 58rpx;
		width: 64rpx;
		margin-left: 40rpx;
	}

	.floor-left .red-point {
		position: absolute;
		top: -10rpx;
		right: 10rpx;
		height: 44rpx;
		width: 44rpx;
		font-size: 24rpx;
		line-height: 44rpx;
		text-align: center;
		color: #ffffff;
		background: #ee3737;
		border: 1px solid #ffffff;
		border-radius: 50%;
	}

	.floor-right {
		flex: 4;
		display: flex;
		justify-content: space-evenly;
	}

	.floor-right .to-creat-btn {
		height: 88rpx;
		width: 240rpx;
		text-align: center;
		line-height: 88rpx;
		color: #ff8b46;
		background: #ffffff;
		border: 1px solid #ff8b46;
		border-radius: 22px;
	}

	.floor-right .to-join-btn {
		height: 88rpx;
		width: 240rpx;
		text-align: center;
		line-height: 88rpx;
		color: #ffffff;
		background-image: linear-gradient(90deg, #fe9543 14%, #ff664f 100%);
		box-shadow: 0 4px 8px 0 rgba(166, 13, 0, 0.23);
		border-radius: 22px;
		margin-right: 20rpx;
	}

	/* 底部栏 end */

	/* 联系老师弹窗 start */
	.contact-teacher-pop-wrap {
		width: 640rpx;
		margin: 0 auto;
		font-size: 32rpx;
		background: #FFFFFF;
		border-radius: 20rpx;
		padding: 28rpx 0;
	}

	.contact-teacher-pop-wrap .teacher-pop-tip {
		text-align: center;
		color: #FF8B46;
	}

	.contact-teacher-pop-wrap .teacher-code-warp image {
		width: 580rpx;
		margin: 30rpx auto;
		text-align: center;
	}

	.contact-teacher-pop-wrap .teacher-info {
		text-align: center;
		display: flex;
		justify-content: space-between;
		margin: 0 40rpx;
	}

	.contact-teacher-pop-wrap .teacher-info .copy-btn {
		display: inline-block;
		height: 48rpx;
		width: 140rpx;
		text-align: center;
		line-height: 48rpx;
		color: #FFFFFF;
		font-size: 26rpx;
		background-image: linear-gradient(90deg, #FE9543 14%, #FF664F 100%);
		border-radius: 15px;
	}

	.contact-teacher-pop-wrap .teacher-info:not(last-child) {
		margin-bottom: 20rpx;
	}

	/* 联系老师弹窗 end */


	/* 不明所以 start */
	.course_type-title {
		width: 100%;
		height: 80rpx !important;
		position: relative;
	}

	.act-state-detail {
		width: 236upx;
		height: 66upx;
		background-image: url(https://tool.tuanhaoke.cn/static/image/home/home_image_background.png);
		background-repeat: no-repeat;
		background-size: 1005 100%;
		text-align: center;
		font-size: 30upx;
		color: #FFFFFF;
		line-height: 66upx;
		position: absolute;
		top: -4upx;
		left: 50%;
		transform: translate(-50%, 0);
	}

	.act-state-tip {
		color: #FF391F;
		font-size: 24upx;
		position: absolute;
		top: 80upx;
		left: 50%;
		transform: translate(-50%, 0);
	}

	.course-details-title {
		color: #333333;
		font-size: 30upx;
		padding-top: 40upx;
		box-sizing: border-box;
	}

	.course-details-content {
		display: flex;
		justify-content: space-between;
		margin-top: 20upx;
	}

	.course-content-left {
		display: flex;
		justify-content: center;
		text-align: center;
	}

	.course-content_img {
		width: 160upx;
		height: 120upx;
		max-height: 120upx;
		max-width: 160upx;
		background: rgba(0, 0, 0, 0.1);
	}

	.course-content-left>view {
		margin-left: 20upx;
		font-size: 24upx;
	}

	.course-content-sold {
		color: #999999;
	}

	.course-content-sold>text {
		text-decoration: line-through;
	}

	.course-content-sale {
		color: #333333;
		margin-top: 10upx;
	}

	.course-content-sale>text {
		color: #FF391F;
	}

	.group-sale {
		color: #333333;
		margin-top: 8upx;
	}

	.group-sale>text {
		color: #FF391F;
	}

	.group-sale>text:last-child {
		font-size: 32upx;
	}

	.course-content-right {
		padding-top: 32upx;
		box-sizing: border-box;
	}

	.course-content-right>view:first-child {
		color: #999999;
		font-size: 24upx;
		text-align: center;
	}

	.course-content-right>view:last-child {
		width: 156upx;
		height: 48upx;
		line-height: 48upx;
		background: #F2F2F2;
		border-radius: 24upx;
		display: flex;
		color: #333333;
		font-size: 30upx;
		justify-content: space-between;
		margin-top: 6upx;
	}

	.course-content-right>view:last-child>image {
		width: 48upx;
		height: 48upx;
		border-radius: 50%;
	}

	.course-details-tip {
		display: flex;
		justify-content: space-between;
		margin-top: 6upx;
	}

	.course-details-tip>view {
		color: #999999;
		font-size: 24upx;
	}

	.course-details-tip>view>text {
		color: #FF391F;
	}

	.check-details {
		width: 100%;
		padding: 14upx 0;
		box-sizing: border-box;
		margin-top: 30upx;
		color: #999999;
		font-size: 24upx;
		text-align: center;
		vertical-align: middle;
		border-top: 1upx solid #DEDEDE;
	}

	.check-details>image {
		width: 28upx;
		height: 28upx;
		border-radius: 50%;
		margin-left: 10upx;
		vertical-align: middle;
	}

	/* 不明所以 end */
	/* 分享提示 start */
	.popup_box_de_share {
		width: 100%;
		height: 100%;
	}

	.popup_box_close_share {
		width: 300upx;
		height: 300upx;
		position: fixed;
		top: 10upx;
		right: 10upx;
	}

	/* 分享提示 end */
	.clues{
		display: inline-block;
		font-size: 26upx;
		color: rgba(255,255,255,0.7);
		background-color: rgba(129, 129, 129, 0.8);
		width: 56upx;
		height: 60upx;
		padding: 10upx 14upx 20upx 16upx;
		border-radius: 100upx;
	}
</style>
